<template>
  <!-- <van-nav-bar
    v-if="showNavbar"
    :title="(route.meta.title as string)"
    @click-left="router.back()"
  >
  <template #left> 
    <van-icon name="arrow-left" size="24" color="#333" />
  </template>
</van-nav-bar> -->
  <!-- <NavBar></NavBar> -->
  <!-- 路由跳转过渡效果 -->
  <router-view v-slot="{ Component }">
    <transition name="fade">
      <component :is="Component" />
    </transition>
  </router-view>

  <!-- <router-view /> -->
</template>

<script setup lang="ts">
// import NavBar from './components/NavBar/index.vue'
// import { computed } from 'vue'
// import { useRoute, useRouter } from 'vue-router'

// const route = useRoute()
// const router = useRouter()
// const showNavbar = computed(() => { return route.meta.showNavbar })


</script>

<style lang="less" scoped>
// :deep(.van-nav-bar__title) {
//   font-size: 18px;
//   color: #333;
// }

//开始过度
.fade-enter-from {
  opacity: 0;
}

//开始过度了
.fade-enter-active {
  transition: all 0.3s linear;
}

//过度完成
.fade-enter-to {
  opacity: 1;
}

//离开的过度
.fade-leave-from {
  opacity: 1;
}

//离开中过度
.fade-leave-active {
  transition: all 0s linear;
}

//离开完成
.fade-leave-to {
  opacity: 0;
}

</style>
